<template>
	<div class="recommend">
		<div v-for="(item, index) in recommends" class="recommend-item">
			<a :href="item.link">
				<img :src="item.image" alt="">
				<div>{{item.title}}</div>
			</a>
		</div>
	</div>
</template>

<script>
	export default {
		name:"RecommendView",
		props: {
			recommends: {
				type: Array,
				default(){
					return []
				}
			}
		}
	}
</script>

<style>
	.recommend {
		display: flex;
		width: 100%;
		padding: 10px 0 20px;
		text-align: center;
		font-size: 12px;
		border-bottom: 8px solid #eee;
	}
	.recommend-item {
		flex: 1;
	}
	.recommend-item img {
		width: 70px;
		height: 70px;
		margin-bottom: 10px;
	}
</style>
